<template>
	<view style="padding: 40rpx 24rpx;">
		<view style="padding: 40rpx 70rpx;background: #FFFFFF;
border-radius: 14rpx;display: flex;justify-content: space-between;font-size: 32rpx;
font-weight: 500;
color: #686868;text-align: center;">
			<view style="">
				<view style="font-size: 36rpx;color: #E93323;margin-bottom: 12rpx;">100.00</view>
				<view>可提积分</view>
			</view>
			<view >
				<view style="font-size: 36rpx;margin-bottom: 12rpx;">0.00</view>
				<view>冻结积分</view>
			</view>
		</view>
		<view style="margin-top: 38rpx;background: #FFFFFF;
border-radius: 14rpx;padding: 40rpx 32rpx; font-size: 28rpx;">
			<view style="font-weight: 500;">持卡人账号</view>
			<view style="margin-top: 20rpx;display: flex;border-radius: 16rpx;
border: 2rpx solid #EEEEEE;padding: 20rpx;">
<input style="width: 70%;"  placeholder="请输入持卡人账号" v-model.number="account"  />
			</view>
			
			<view style="font-weight: 500;margin-top: 20rpx;">持卡人姓名</view>
			<view style="margin-top: 20rpx;display: flex;border-radius: 16rpx;
						border: 2rpx solid #EEEEEE;padding: 20rpx;">
				<input  style="width: 70%;"  placeholder="请输入持卡人真实姓名" v-model="name"/>
			</view>
			<view style="font-weight: 500;margin-top: 20rpx;">银行名称</view>
			<view style="margin-top: 20rpx;display: flex;border-radius: 16rpx;
						border: 2rpx solid #EEEEEE;padding: 20rpx;">
				<input  style="width: 70%;"  placeholder="请输入持卡银行名称" v-model="name"/>
			</view>
			<view style="font-weight: 500;margin-top: 20rpx;">提现数量</view>
			<view style="margin-top: 20rpx;display: flex;border-radius: 16rpx;
						border: 2rpx solid #EEEEEE;padding: 20rpx;">
				<input type="digit" style="width: 70%;" placeholder="请输入提现数量" v-model.number="writeMoney" @input="oninput"/>
				<view style="flex: 1;color: #E93323;" v-if="istips">超出可用数量</view>
			</view>
			<view style="display: flex;justify-content: space-between;font-size: 28rpx;color: #E93323;margin-top: 30rpx;">
				<view>手续费：{{commission}}</view>
				<view>实际到账：{{anc_reality}}</view>
			</view>

		</view>
	
		<view style="margin-top: 50rpx;">
			<view style="font-size: 32rpx;font-weight: 500;">提现规则</view>
			<view style="line-height: 44rpx;font-size: 24rpx;">
				 <view style="white-space:pre-wrap;">{{ ruletext }}</view>
				
			</view>
		</view>
		<button style="display: flex;flex-direction: column;width: 570rpx;
height: 100rpx;

border-radius: 16rpx;align-items: center;margin: auto;justify-content: center;color: #fff;margin-top: 80rpx;"
			:disabled="dis" :style="dis?'background: #D6D6D6;':'background: #E93323;'" @click="towithdrawal">确认提现</button>
		<view style="margin-top: 50rpx;text-align: center;font-size: 32rpx;font-weight: 500;" @click="torecord">提现记录</view>



	</view>
</template>

<script>
	var that
	import {
		anc_reflect,
		getUserInfo,
		get_setting,
		anc_reflect_rate
	} from '@/api/user.js';
	import {
		navigateBack
	} from '../../../libs/uniApi';
	export default {
		data() {
			return {
				account:'',
				writeMoney: 0,
				ancnum: 0,
				phone:'',
				name:'',
				password:'',
				istips: false,
				rate:0,
				ruletext:''
			}
		},
		onLoad(e) {
			that = this
			that.ancnum = e.ancnum
			this.getancreflectrate()
			that.getrule()
		},
		onShow() {
			that.getUserInfo()
		},
		computed: {
			//判断是否输入账户和密码
			dis() {
				//当两个都不为空才行
				return this.account==''|| this.writeMoney == 0 || this.writeMoney == null || parseFloat(this.writeMoney) > parseFloat(this
					.ancnum)||this.writeMoney==0 ||this.phone==''||this.name==''||this.password=='';
			},
			commission(){
				let data = that.writeMoney*that.rate
				let tempVal = parseFloat(data).toFixed(2)
				// let realVal = tempVal.substring(0, tempVal.length - 1)
				return tempVal;
			},
			anc_reality(){
				let data = that.writeMoney *(1-parseFloat(that.rate))
				let tempVal = parseFloat(data).toFixed(3)
				let realVal = tempVal.substring(0, tempVal.length - 1)
				return realVal;
			},
		},
		methods: {
			/**
			 * 获取个人用户信息
			 */
			getUserInfo: function() {
				let that = this;
				getUserInfo().then(res => {
					
						console.log('获取',res.data.vc_name)
						that.name=res.data.vc_name
						console.log('获取that.name',that.name)
						that.phone=res.data.vc_phone
						that.account=res.data.vc_number
					
				});
			},
			getrule(){
				get_setting({group:'ANCTX',title_en:'NOTE'}).then(res => {
					let data = res.data
					this.ruletext=data.value
				}).catch(err => {
							return this.$util.Tips({
								title: err
							});
						});
			},
			getancreflectrate(){
				anc_reflect_rate().then(res => {
					this.rate=res.data.ATX
					console.log('this.rate',this.rate)
				});
			},
			oninput(e) {
				if (parseFloat(that.writeMoney) > parseFloat(that.ancnum)) {
					that.istips = true
				} else {
					that.istips = false
				}
				e.target.value = (e.target.value.match(/^\d*(\.?\d{0,2})/g)[0]) || null
				//重新赋值给input
				this.$nextTick(() => {
					that.writeMoney = e.target.value
				})

			},
			// 设置版通信息
			tosetdeal(){
				var that =this
				that.isdpswshow=false
				uni.navigateTo({
					url:"/pages/users/user_vcinfo_edit/index"
				})
			},
			towithdrawal() {
				let that = this;
			
				if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.phone)) return that.$util.Tips({
					title: that.$t(`请输入正确的手机号码`)
				});
				anc_reflect({
					anc_wallet: that.writeMoney,
					transaction_passwd:that.password
				}).then(res => {
					let data = res.data
					this.$util.Tips({
						title: res.msg,
						icon: 'success'
					});
					setTimeout(function() {
						uni.navigateBack()
					}, 1000)
				}).catch(err => {
					return this.$util.Tips({
						title: err
					});
				});
			},
			torecord() {
				uni.navigateTo({
					url: 'withdrawal_record'
				})
			}
		}
	}
</script>

<style>

</style>